import { useCallback, useEffect, useState } from 'react';
import './App.css';
import IndexPage from './components/Index';
import Setting from './components/Setting';
import { DEFAULT_APP_URL, STORAGE_KEY } from './defined/app';

function App() {
  const [path, setPath] = useState('/');
  const handleSetting = useCallback(() => {
    setPath('/setting');
  }, []);

  useEffect(() => {
    if (path !== '/') {
      return;
    }

    const timer = setTimeout(() => {
      location.href = localStorage.getItem(STORAGE_KEY.APP_URL) || DEFAULT_APP_URL;
    }, 3000);

    return () => {
      clearTimeout(timer);
    }
  }, [path]);

  switch (path) {
    case '/setting':
      return <Setting />;
    default:
      return <IndexPage onSetting={handleSetting} />;
  }
}

export default App;
